/**
 * @author:linjiye
 * @date:2024/12/30
 * @desc:
 **/

import {StyleSheet, Text, View} from 'react-native'
import React from 'react'

type Props = {
    text: string,
    keywords: string,
    style?: object,
    textStyle?: object,
    textHeightLightStyle?: object
}

const KeywordHighlighter = ({text, keywords, style,textStyle,textHeightLightStyle}: Props) => {
    if (!text) return null
    const newData = text.split(keywords) //  通过关键字的位置开始截取，结果为一个数组

    return (
        <Text style={style}>
            {
                newData.map((item, index) => {
                    if (!index) { // 当下标是0的时候，直接返回当前项
                        return <Text style={textStyle} key={index}>{item}</Text>
                    } else {
                        return <Text style={textStyle}  key={index}><Text style={textHeightLightStyle}>{keywords}</Text>{item}</Text>
                    }
                })
            }
        </Text>
    )
}

export default KeywordHighlighter

const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: "center",
        alignItems: "center",
    }
})